<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
response.setHeader("Pragma","No-cache"); 
response.setHeader("Cache-Control","no-cache"); 
response.setDateHeader("Expires", 0); 

response.flushBuffer();
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="../css/index.css">
<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.5/themes/default/easyui.css">
<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.5/themes/icon.css">
<link rel="stylesheet" type="text/css" href="../jquery-easyui-1.4.5/themes/color.css">
<script type="text/javascript" src="../jquery-easyui-1.4.5/jquery.min.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.4.5/jquery.easyui.min.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.4.5/easyui.plugin.js"></script>
<script type="text/javascript" src="../jquery-easyui-1.4.5/datagrid-groupview.js"></script>
<script type="text/javascript" src="../js/echarts.min.js"></script>
<link rel="stylesheet" type="text/css" href="../css/index.css">
<title>库存统计</title>
<script type="text/javascript">
   var path="<%=basePath%>"; 
   		    
</script>
</head>
<body class="easyui-layout">
<div region="center"   split="true"   title="数据统计" style="overflow: hidden;">

选择客户<input id="clname" class="easyui-combobox" name="clname" data-options="required:true,valueField:'id',textField:'clientname',url:'<%=basePath%>clientinfo/getallclient1.html',
	     onSelect:function(objs)
		    {
		    	$('#clname').combobox('setValue',objs.clientname);
		    	ss(objs.clientname);
		    }"  />
<div id="main"  style="height:450px"></div>
<script type="text/javascript">
function ss(o){
   	  o = encodeURI(o);
	  o = encodeURI(o);
	$.ajax({  
	      type:'post',      
	      url:path+'report1/reportalldate.html?name='+o,  
	      cache:false,  
	      dataType:'json',  
	      success:function(data){
		    var s=data.rows;
		    var name=[];
		    var ck=[];
		    var rkd=[];
		    var ckd=[];
          for (var i = 0; i < s.length; i++) {
				name.push(s[i].goodname);
				ck.push(s[i].goodnumber);
				rkd.push(s[i].rkd);
				ckd.push(s[i].ckd);
			}
		    
		    var myChart = echarts.init(document.getElementById('main')); 
		    var option={
		    	    tooltip : {
		    	        trigger: 'axis'
		    	       
		    	    },
		    	    legend: {
		    	        data:['物品库存','物品出库量','物品入库量']
		    	    },
		    	    grid: {
		    	        left: '3%',
		    	        right: '4%',
		    	        bottom: '3%',
		    	        containLabel: true
		    	    },
		    	    xAxis : [
		    	        {
		    	            type : 'category',
		    	             boundaryGap : true,
		    	            data : name

               
		    	        }
		    	    ],
		    	    yAxis : [
		    	        {
		    	            type : 'value'
		    	        }
		    	    ],
		    	    series : [
		    	        {
		    	            name:'物品库存',
		    	            type:'bar',
		    	             stack: '广告',
		    	            data:ck
		    	        },
		    	        {
		    	            name:'物品出库量',
		    	            type:'bar',
		    	            stack: '广告',
		    	            data:ckd
		    	        },
		    	        {
		    	            name:'物品入库量',
		    	            type:'bar',
		    	            stack: '广告',
		    	            data:rkd
		    	        }
		    	]
		    	};
		    myChart.setOption(option);
		    
	      },
		    error:function(){ 
		    	
		    }
	  });
	
}
$(function(){
	$.ajax({  
	      type:'post',      
	      url:path+"report1/reportalldate.html?name=",  
	      cache:false,  
	      dataType:'json',  
	      success:function(data){
		    var s=data.rows;
		    var name=[];
		    var ck=[];
		    var rkd=[];
		    var ckd=[];
        for (var i = 0; i < s.length; i++) {
				name.push(s[i].goodname);
				ck.push(s[i].goodnumber);
				rkd.push(s[i].rkd);
				ckd.push(s[i].ckd);
			}
		    
		    var myChart = echarts.init(document.getElementById('main')); 
		    var option={
		    	    tooltip : {
		    	        trigger: 'axis',
		    	        axisPointer : {            // 坐标轴指示器，坐标轴触发有效
		    	            type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
		    	        }
		    	    },
		    	    legend: {
		    	        data:['物品库存','物品出库量','物品入库量']
		    	    },
		    	    grid: {
		    	        left: '3%',
		    	        right: '4%',
		    	        bottom: '3%',
		    	        containLabel: true
		    	    },
		    	    xAxis : [
		    	        {
		    	            type : 'category',
		    	            data : name
		    	        }
		    	    ],
		    	    yAxis : [
		    	        {
		    	            type : 'value'
		    	        }
		    	    ],
		    	    series : [
		    	        {
		    	            name:'物品库存',
		    	            type:'bar',
		    	             stack: '广告',
		    	            data:ck
		    	        },
		    	        {
		    	            name:'物品出库量',
		    	            type:'bar',
		    	            stack: '广告',
		    	            data:ckd
		    	        },
		    	        {
		    	            name:'物品入库量',
		    	            type:'bar',
		    	            stack: '广告',
		    	            data:rkd
		    	        }
		    	]
		    	};
		    myChart.setOption(option);
		    
	      },
		    error:function(){ 
		    	
		    }
	  });
});
</script>
</div>
</body>
</html>